Ext.define('BISC.view.ServerManagerPanel', {
	extend: 'Ext.grid.Panel',
	alias: ['widget.servermanagerpanel'],
	requires: [
        'BISC.view.FormCreateServer',
        'BISC.view.CtxMnuServer'
    ],
	id: 'serversGrid',
	border: false,
	bodyBorder: false,
    store: 'ServerStore',
	initComponent: function() {
		var me = this;
		Ext.applyIf(me, {
            columns: [
                {
                    dataIndex: 'name',
                    text: 'Name',
                    flex: 2
                },
                {
                    dataIndex: 'description',
                    text: 'Description',
                    flex: 4
                },
                {
                    xtype: 'booleancolumn',
                    dataIndex: 'active',
                    text: 'Enabled?',
                    flex: 1,
                    falseText: 'No',
                    trueText: 'Yes',
                    undefinedText: 'n/a'
                },
                {
                    dataIndex: 'url',
                    text: 'Host',
                    flex: 2
                },
                {
                    dataIndex: 'path',
                    text: 'API Path',
                    flex: 2
                }
            ],
            scope: this,
            listeners: {
                itemdblclick: function( grid, record, el, ind, e, opts ) {
                    var me = this;
                    var form = Ext.create( 'BISC.view.FormCreateServer', { record: record, mode: 'edit' } );
                    var wndw = Ext.create('Ext.window.Window', {
                        title: 'Edit Server',
                        iconCls: 'icon_editDevice',
                        modal: true,
                        height: 260,
                        width: 400,
                        resizable: false,
                        layout: 'fit',
                        items: [
                            form
                        ]
                    }).show();
                    wndw.on( 'done', function() {
                        wndw.close();
                        grid.getStore().load();
                    });
                },
                itemcontextmenu: function(view, record, item, index, e) {
                    e.stopEvent();
                    Ext.create('BISC.view.CtxMnuServer', {record: record}).showAt( e.getXY() );
                }
            },
            dockedItems: [{
                xtype: 'toolbar',
                dock: 'top',
                items: [{
                    text: 'Add Server',
                    iconCls: 'icon_addDevice',
                    scope: this,
                    handler: this.createServer
                }]
            }]
		});

		me.callParent(arguments);
	},
	createServer: function() {
        var me = this;
        var form = Ext.create( 'BISC.view.FormCreateServer', { mode: 'add' } );
		var tmpwndw = Ext.create('Ext.window.Window', {
			title: 'Add New Server',
			iconCls: 'icon_addDevice',
			modal: true,
			height: 260,
			width: 400,
            resizable: false,
			layout: 'fit',
			items: [
                form
			]
		}).show();
        tmpwndw.on( 'done', function() {
            tmpwndw.close();
            Ext.getCmp('serversGrid').getStore().load();
        });
	}

});
